<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ include file="/pages/common/header.jsp"%>
<html>
	<head>
		<title>Sales Report</title>
		<script src="${jsContext}/jquery/jquery.dataTables.js" type="text/javascript"></script>
		<script src="${jsContext}/jquery/TableTools.js" type="text/javascript"></script>
		<script src="${jsContext}/jquery/ZeroClipboard.js" type="text/javascript"></script>
	
		<script type="text/javascript">		
			jQuery(document).ready(function() {
				jQuery('#salesReport').dataTable( {
					"bPaginate"      : true,
			        "sPaginationType": "full_numbers",// PaginationType:1.full_numbers 2. two_buttons
			        "aoColumns": [
						{ "sWidth":"8%"},
						{ "sWidth":"10%"},
						{ "sWidth":"20%"},
						{ "sWidth":"15%" },
						{ "sWidth":"10%"},
						{ "sWidth":"10%","bSortable": false},
						{ "sWidth":"13%","bSortable": false},
						{"bSortable": false }
					],
					/* "aaSorting": [[ 0, "desc" ]] , */
				});
			 });
		</script>
	</head>
	<body class="mainbody">
	<c:set var="orderList" value="${requestScope.orders}"/>
		<div class="mainContainer">
			<section class="bodyContainer">
				<div class="omsproductReport">
         			<div class="popheadingBgDiv">
			        	<h2 class="popTitleTxtBig">Sales Report</h2>
			            <!-- <p class="popPrintButtonDiv"><a href="">Print</a></p> -->
			  		</div>
			  		<p class="hrlineBr"></p>
		       		<p class="spacerTopTen"></p>
			  		<p class="spacerTopTen"></p>
            		
			        <div class="orderSearchFldDiv">
			        	<span class="orderDateLable">Start Date</span>
			        	<span class="omsDatefld"><input type="text" value="" id="startDate" class="datepicker omsDteFld" readOnly></span>
			        	<!-- <span class="caldImg"><img src="" width="24" height="24"></span> -->
			            <span class="orderDateLable">End Date</span>
			            <span class="omsDatefld"><input type="text" value="" id="endDate" class="datepicker omsDteFld" readOnly></span>
			            <%-- <span class="caldImg"><img src="${imageContext}/calendar.gif" width="24" height="24"></span> --%>
			            <span class="searchBtn" onclick="return checkDate('startDate','endDate')">Search</span>
			        </div>
			        <p class="hrlineBr"></p>
					<p class="spacerTopTen"></p>
		            <p class="spacerTopTen"></p>
		            <div class="popheadingBgDiv">
        				<h2 class="popTitleTxtBig">Sales Report </h2>
  					</div>
    				<p class="spacerTopTen"></p>
      				<div class="divclear">            
            			<table cellpadding="0" cellspacing="0" border="0" class="display reportTable" id="salesReport" width="100%">
            				<thead>
            					<tr>
		                            <th>Sr.No.</th>
		                            <th>Order ID</th>
		                            <th>Customer</th>
		                            <th>Status</th>
		                            <th>Date</th>
		                            <th>Amount</th>
		                            <th>Details</th>
		                            <th>Change Status</th>
		                        </tr>
            				</thead>
                      		<tbody>
                      			<c:forEach var="order" items="${orderList}" varStatus="count">
                      			<tr>
		                            <td>${count.index+1}</td>
		                            <td>${order[0]}</td>
		                            <td>${order[1]}</td>
		                            <td>${order[3]}</td>
		                            <td>${order[3]}</td>
		                            <td><a href="productDetails.jsp">${order[2]}</a></td>
		                            <td>Details</td>
		                            <td><a href="#" onclick="ShowModalPopup('dvPopup'); return false;">Change Status</a></td>
		                        </tr>
		                        </c:forEach>
                      		</tbody>
                    	</table>
       				</div>  	
					<p class="spacerTopTen"></p>
					<p class="spacerTopTen"></p>  	  
      			</div>
 			</section>
		</div>
		<!--main container-->
		<p class="spacerTopTen"></p>
		<p class="spacerTopTen"></p>

		<!--PopUp Conent-->
		<div id="dvPopup">
			<span class="closeBtn"> <a href="#" onclick="HideModalPopup('dvPopup'); return false;"><img src="${imageContext}/cross.png"></a></span>
		    <div class="popheadingBgDiv">
		    	<h2 class="popTitleTxtBig">Change Status Order</h2>
		        <p class="popPrintButtonDiv"><a href="">Print</a></p>
		  	</div>
			<div class="orderStatusTxt">Change Order Status And Update </div>
		    <p class="spacerTopTen"></p>
		    <p class="spacerTopTen"></p>
		    <div class="omsRemarkStatus">
	        	<div class="divclear">
	            	<span class="omsloginlabel">Status : </span>
	                <span class="omslogininputFld"><input type="text" name="type" class="omsloginfld"></span>
	            </div>
	            
	            <div class="divclear">
	            	<span class="omsloginlabel">Remark : </span>
	                <span class="omslogininputFld">
              			<select class="omsloginSelectfld" name="color">
             				<option>----Please Select-----</option>
                           <option>Remark</option>
                           <option>Remark</option>
                       </select>
	               	</span>
	            </div>
	            
	            <p class="spacerTopTen"></p><p class="spacerTopTen"></p>
	            <div class="divclear">
                   <span class="loginlabel"></span>
                   <span class="buttonSiyora"><a href="">Update Status</a></span>
	       		</div>
	      	</div>	
		</div>
		<jsp:include page="/pages/common/footer.jsp" />
	</body>
</html>